import React, { Component } from 'react'
import axios from 'axios'
import PubSub from 'pubsub-js'
export default class Search extends Component {
  searchBtn = () => {
    const {
      keywordNode: { value: keywords }
    } = this
    PubSub.publish('getSearchList', {
      isFirst: false,
      isLoading: true,
      errMsg: ''
    })
    // this.props.setAppData({
    //   isFirst: false,
    //   isLoading: true,
    //   errMsg: ''
    // })
    axios
      .get(`/api/search/users222?q=${keywords}`)
      .then((res) => {
        PubSub.publish('getSearchList', {
          isFirst: false,
          userList: res.data.items,
          isLoading: false,
          errMsg: ''
        })
        // this.props.setAppData({
        //   isFirst: false,
        //   userList: res.data.items,
        //   isLoading: false,
        //   errMsg: ''
        // })
      })
      .catch((err) => {
        PubSub.publish('getSearchList', {
          isFirst: false,
          errMsg: err.message,
          isLoading: false
        })
        // this.props.setAppData({
        //   isFirst: false,
        //   errMsg: err.message,
        //   isLoading: false
        // })
      })
  }
  render() {
    return (
      <section className="jumbotron">
        <h3 className="jumbotron-heading">Search Github Users</h3>
        <div>
          <input
            type="text"
            placeholder="请输入您要搜索的内容"
            ref={(c) => (this.keywordNode = c)}
          />
          &nbsp;<button onClick={this.searchBtn}>搜索</button>
        </div>
      </section>
    )
  }
}
